<template>
	<view class="bgDefault default-page">
		<!-- 顶部自定义导航 -->
		<tn-nav-bar fixed>意见反馈</tn-nav-bar>
		
		<view :style="{paddingTop: vuex_custom_bar_height + 'px'}">
			<view class="container">
			  <tn-form :model="model" ref="form" :labelPosition="labelPosition" :labelWidth="labelWidth" :labelAlign="labelAlign">
				<view class="content tn-flex tn-flex-direction-row tn-flex-col-center">
				  <view class="content__data tn-flex-1">
					<tn-input v-model="model.content" :clearable="false" type="textarea" :customStyle="customStyle" :height="400" placeholder="请输入意见"></tn-input>
				  </view>
				</view>
				
				<view class="submit-btn"  @click="submit">提交</view>
			</tn-form>
			</view>
			
			<TemplateLoading :active="loading"></TemplateLoading>
		</view>
	</view>
</template>

<script>
	import {addAdvice} from '@/api/operations/index.js'
	export default {
		data() {
			return {
				model:{
					content:""
				},
				loading:false,
				labelPosition: 'left',
				labelAlign: 'right',
				labelWidth: 140,
				customStyle:{
					background: "#f9f9f9",
					fontSize: "12px",
					padding: "15px",
					lineHeight: "32px",
				}
			}
		},
		onLoad() {
			//console.log(this.vuex_custom_bar_height)
		},
		methods: {
			submit(){
				
				if(this.model.content != "" && this.model.content.length > 0){
					this.loading = true
					addAdvice(this.model).then(res=>{
						this.loading = false
						
						uni.showToast({
							icon: 'none',
							duration:3000,
							title: '我们已收到您的建议，等待客服处理！',
							complete:function(){
								
								setTimeout(function(){
									uni.navigateTo({
									  url: "/pages/index/index?index=4"
									})
								}, 3000)
								
							}
						})
						
						
					}, err=>{
						this.loading = false
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
  .bgDefault{
  	background: $tn-main-bg;
  }
  
  .default-page {
    width: 100vw;
    height: 100vh;
    /* display: flex; */
    align-items: center;
    justify-content: center;
  	font-family: "微软雅黑";
  }
  .container{
	  margin: 28px 7%;
	  background-color: #FFFFFF;
	  box-shadow: 0px 5px 25px 0px rgba(0, 3, 72, 0.1);
	  border-radius: 10px;
	  overflow: hidden;
	  
	  /* 授权按钮 */
	  .submit-btn {
	    background: $tn-main-orange;
		width: 90%;
	    color: #FFFFFF;
	    border-radius: 20rpx;
	    font-size: 28rpx;
	    margin: 40rpx auto;
		line-height: 36px;
		text-align: center;
	  }
  }
  
  
</style>
